<template>
	<view class="auth-layout">
		<text class="auth-title">选择认证类型</text>
		<text class="auth-subtitle">请选择适合您的认证类型进行认证</text>
		<view class="auth-type-item bg-person" @tap="selectAuthType(1)">
			<text class="auth-type-item-title">个人认证</text>
			<text class="auth-type-item-subtitle">适用于个人用户认证</text>
		</view>
		<view class="auth-type-item bg-company" @tap="selectAuthType(2)">
			<text class="auth-type-item-title">企业认证</text>
			<text class="auth-type-item-subtitle">适用于企业用户认证</text>
		</view>
	</view>
</template>

<script setup>
	import { useFormStore } from '@/common/stores'
	const formStore = useFormStore()
	const selectAuthType = (type)=>{
		formStore.$reset()
		if(type == 1){
			formStore.agentType = '个人'
			uni.navigateTo({
				url:'/pages/my/auth/idcard/idcard'
			})
		}
		else{
			formStore.agentType = '企业'
			uni.navigateTo({
				url:'/pages/my/auth/enterprise/enterprise'
			})
		}
	}
</script>

<style lang="scss" scoped>
.auth-layout{
	min-height: 100vh;
	background-color: #fff;
	display: flex;
	flex-direction: column;
	padding: 30rpx 50rpx;
	.auth-title{
		font-size: 48rpx;
		font-weight: bold;
	}
	.auth-subtitle{
		font-size: 26rpx;
		color: $xh-color-9;
		margin-top: 10rpx;
	}
	.auth-type-item{
		display: flex;
		flex-direction: column;
		justify-content: center;
		background-size: 100% 100%;
		background-repeat: no-repeat;
		height: 266rpx;
		color: #fff;
		padding: 30rpx;
		text:nth-child(2){
			margin-top: 16rpx;
		}
	}
	.bg-person{
		background-image: url('/static/my/auth_person_icon.png');
		margin-top: 80rpx;
		margin-bottom: 30rpx;
	}
	.bg-company{
		background-image: url('/static/my/auth_company_icon.png');
		
	}
}
</style>